import 'package:valovault_reminder/common/config/val_client_url_path.dart';
import 'package:valovault_reminder/common/util/val_router_manager.dart';
import 'package:valovault_reminder/pages/base/val_base_ui_page.dart';
import 'package:valovault_reminder/pages/web/val_webview_controller.dart';
import 'package:flutter/material.dart';
import 'package:package_info_plus/package_info_plus.dart';
import '../../common/config/val_assets_name.dart';
import '../base/val_app_common_bar.dart';

class ValMyHomeAboutPage extends StatefulWidget {
  const ValMyHomeAboutPage({super.key});

  @override
  State<ValMyHomeAboutPage> createState() => _ValMyHomeAboutPageState();
}

class _ValMyHomeAboutPageState extends ValBaseUIPageState<ValMyHomeAboutPage> {
  String versionCode = '';

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    isAppBar = true;
    resizeToAvoidBottomInset = false;
    bgColor = const Color(0xFF143A42);

    loadAppVersionName();
  }

  @override
  PreferredSizeWidget? get appBar {
    return ValAppCommonBar(
      backgroundColor: Colors.transparent,
      title: 'About',
      titleColor: Colors.white,
      brightness: Brightness.dark,
      leadingWidget: GestureDetector(
          onTap: () {
            Navigator.of(context).pop();
          },
          child: Image.asset(
            '${ValAssetsName.ASSETS_MINE}val_my_home_back_btn.png',
            width: 30,
            height: 30,
          )
      ),
    );
  }

  ///点击列表
  void clickedAboutMenu(int index) {
    if (index == 1) {
      ValRouterManager.open(ValWebViewController(ValClientUrlPath.termsConditionUrl, title: 'Term of Use',));
    }
    else if (index == 2) {
      ValRouterManager.open(ValWebViewController(ValClientUrlPath.privacyUrl, title: 'Privacy Policy',));
    }
  }

  void loadAppVersionName() async {
    PackageInfo packageInfo = await PackageInfo.fromPlatform();
    setState(() {
      versionCode = packageInfo.version;
    });
  }

  Widget createTextContentItem({String title = '', int index = 0}) {
    return GestureDetector(
      onTap: () {
        clickedAboutMenu(index);
      },
      child: createCommonContent(
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              Text(title, style: const TextStyle(fontSize: 16, color: Colors.white, fontWeight: FontWeight.w500),),
            ],
          ),
      ),
    );
  }

  Widget createCommonContent({Widget? child}) {
    return Container(
      height: 64,
      width: double.infinity,
      alignment: Alignment.centerLeft,
      margin: const EdgeInsets.only(left: 38, right: 38),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          Expanded(child: child ?? Container()),
          Container(height: 1, color: const Color.fromRGBO(255, 255, 255, 0.25), ),
        ],
      ),
    );
  }

  @override
  Widget buildBody(BuildContext context) {
    return Stack(
      children: [
        Positioned(
            top: 0, left: 0, right: 0, bottom: 0,
            child: Container(
                decoration: const BoxDecoration(
                  gradient: LinearGradient(
                    begin: Alignment.topRight,
                    end: Alignment.bottomCenter,
                    colors: [
                      Color(0xFF143A42),
                      Color(0xFF090B24),
                    ],
                  ),))
        ),
        Positioned(
          top: 0, left: 0, right: 0, bottom: 0,
          child: Column(
            children: [
              const Padding(padding: EdgeInsets.only(top: 40)),
              createCommonContent(
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      const Expanded(
                        flex: 1,
                        child: Text('Version', style: TextStyle(fontSize: 16, color: Colors.white, fontWeight: FontWeight.w500),),
                      ),
                      Expanded(
                        flex: 1,
                        child: Text(versionCode, textAlign: TextAlign.right, style: const TextStyle(fontSize: 16, color: Colors.white, fontWeight: FontWeight.w500),),
                      ),
                    ],
                  ),
              ),
              createTextContentItem(title: 'Terms And Conditions', index: 1),
              createTextContentItem(title: 'Privacy Policy', index: 2),
            ],
          ),
        ),
      ],
    );
  }
}
